import { RJSFSchema, WidgetProps } from '@rjsf/utils';
import { Button } from 'antd';
import './multi-solution.scss';

export const MULTI_SOLUTION_SCHEMA: RJSFSchema = {
  type: 'array',
  items: {
    type: 'number',
  },
};

export const MultiSolutionWidget = (props: WidgetProps) => {
  const current = props.value?.[0] + 1;
  const count = props.value?.[1];
  const onPreview = props?.uiSchema?.['ui:options']?.preview as any;
  if (count === 0 || count == null) return null;

  const onPreClick = () => {
    props.onChange([props.value[0] - 1, count]);
    onPreview?.();
  };

  const onNextClick = () => {
    props.onChange([props.value[0] + 1, count]);
    onPreview?.();
  };

  return (
    <div className='command-form__multi-solution-widget'>
      <Button
        disabled={current === 1}
        onClick={onPreClick}>
        上一解
      </Button>
      {current}/{count}
      <Button
        disabled={current === count}
        onClick={onNextClick}>
        下一解
      </Button>
    </div>
  );
};
